<CustomAxisRangeControl label="Simple control" bind:value></CustomAxisRangeControl>
<CustomAxisRangeControl label="Control with very long label" bind:value></CustomAxisRangeControl>
<CustomAxisRangeControl
    label="Controll with help text"
    bind:value
    miniHelp="This some help text."
></CustomAxisRangeControl>
<CustomAxisRangeControl label="Disabled control" bind:value disabled></CustomAxisRangeControl>
<CustomAxisRangeControl
    label="Custom default"
    bind:value
    placeholder="{{ min: 'Foo', max: 'Bar' }}"
></CustomAxisRangeControl>

<pre><code>
{ output }
</code></pre>

<script>
    import CustomAxisRangeControl from '../CustomAxisRangeControl.html';

    export default {
        components: { CustomAxisRangeControl },

        computed: {
            output: ({ value }) => JSON.stringify({ value }, null, 2)
        }
    };
</script>
